<!--  -->
<template>
  <div class="blockcontent">
    <div
      :class="`mtitle ${titletype==15?'title1':titletype==16?'title2':'title3'}`"
      :style="{ 'box-shadow':mifchoose? `0 0 15px #5aa2e3`:'' }"
    >
      {{titlenumber}}&nbsp;&nbsp;
      <span
        v-html="mtitle"
        :class="`mtitle ${titletype==15?'title1':titletype==16?'title2':'title3'}`"
      >{{mtitle}}</span>
      <!-- <a :href="titlenumber"></a> -->
    </div>
  </div>
</template>

<script>
export default {
  props: ["chartData", "title", "ifchoose", "titletype", "titlenumber"],
  data() {
    return {
      mtitle: this.title,
      mifchoose: ""
    };
  },

  components: {},
  mounted() {},
  computed: {},
  //   watch: {
  //     text(newvalue) {
  //       console.log(newValue);
  //       this.content = newvalue;
  //     }
  //   },
  computed: {
    content: function() {
      return this.text;
    }
  },
  watch: {
    title(newvalue) {
      this.mtitle = newvalue;
    },
    ifchoose(newvalue) {
      this.mifchoose = newvalue;
    }
  },
  methods: {}
};
</script>
<style scoped lang="scss">
.blockcontent {
  .mtitle {
    width: 100%;
  }
  .title1 {
    font-weight: bold;
    font-size: 20px;
  }
  .title2 {
    font-weight: bold;
    font-size: 18px;
  }
  .title3 {
    font-size: 16px;
  }
}
</style>